<!-- 商品详情  -->
<template>
  <!-- <div
    class="ui-detail-swiper"
    v-bind:class="{
      'hide-promotion-bottom': ispromotion,
      'has-goods-stock': isStock <= 0,
    }"
  >-->
  <!-- <product-info v-if="index == 0"></product-info>
    <product-desc v-if="index == 1"></product-desc>
  <product-review v-if="index == 2"></product-review>-->
  <div class="margins">
    <product-info></product-info>
    <!-- <product-review></product-review> -->
    <evaluate></evaluate>
    <product-desc></product-desc>

  </div>
  <!-- </div> -->
</template>

<script>
import ProductInfo from './child/ProductInfo'
import ProductDesc from './child/ProductDesc'
import Evaluate from './child/Evaluate'
// import ProductReview from "./child/ProductReview";
import { mapState, mapMutations } from 'vuex'
export default {
  data () {
    return {
      is_test:this.$parent.is_test
    }
  },

  props: ['isStock'],

  components: {
    ProductInfo,
    ProductDesc,
    Evaluate
    // ProductReview

  },

  computed: {
    ...mapState({
      index: state => state.goodsdetail.index,
      ispromotion: state => state.goodsdetail.ispromotion
    })
  },

  watch: {},

  mounted () {},

  created () {},

  methods: {
    ...mapMutations({}),
    showPreview (index) {
      this.$parent.showPreview(index)
    },
    // shouSrc () {
    //   this.$parent.shouSrc()
    // },
    shouSrc(src){
      // console.log(src)
      this.$parent.shouSrc(src)
    }
  }
}
</script>

<style lang="scss" scoped>
.margins{
  margin-bottom: 2.2rem;
}
.ui-detail-swiper {
  position: absolute;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  top: 2.25rem;
  bottom: 2.5rem;
  left: 0;
  right: 0;
  overflow: auto;
  z-index: 0;
  /* border: 1px solid red; */
  background: rgba(240, 242, 245, 1);

  &.hide-promotion-bottom {
    bottom: 0;
  }
}
</style>
